<template>
  <div class="single">
    <el-row>
      <el-col :span="24">
        <el-form
          :model="formModel"
          :rules="rules"
          ref="formModel"
          label-width="100px"
          class="demo-formModel"
        >
         
          <!-- 是否有市场运作经验 -->
          <el-row>
            <el-col :span="12">
              <el-form-item label="是否有市场运作经验" prop="have_product">
                  <el-select
                  v-model="formModel.have_product"
                  placeholder="请选择是否有市场运作经验"
                  class="el_select"
                >
                  <el-option
                    v-for="item in sellist"
                    :label="item.name"
                    :value="item.val"
                    :key="item.val"
                  ></el-option>
                </el-select>
                
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="是否有知识付费产品的研发经验" prop="have_zhishi">
                <el-select
                  v-model="formModel.have_zhishi"
                  placeholder="请选择是否有知识付费产品的研发经验"
                  class="el_select"
                >
                  <el-option
                    v-for="item in sellist"
                    :label="item.name"
                    :value="item.val"
                    :key="item.val"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          

          <el-row class="btns">
            <el-col :span="24"> 
              <el-form-item>
              <el-button type="primary" @click="submitForm('formModel')"
                >添加</el-button
              >
              <el-button @click="resetForm('formModel')">重置</el-button>
          </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  name:"studyexp",
  data() {
    return {
      sellist: [
        { name: "否", val: 0 },
        { name: "是", val: 1 },
      ],
      formModel: {
        have_product:"",
        have_zhishi:"",
      },
      rules: {
        have_product: [
          { required: true, message: "请选择是否有市场运作经验", trigger: "change" },
        ],
        have_zhishi: [
          { required: true, message: "请选择是否有知识付费产品的研发经验", trigger: "change" },
        ],
        
      },
    };
  },
  methods: {
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          alert("submit!");
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    resetForm(formName) {
      this.$refs[formName].resetFields();
    },
  },
};
</script>


<style >
.single {
  padding: 0.5rem;
}
.el_select {
  width: 20rem;
}
.btns{
  padding-left: 22rem;
}
</style>

